﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>JooQ :: Demos</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <script type="text/javascript" src="scripts/jquery/json2.js"></script>
    <script type="text/javascript" src="scripts/jquery/livequery.js"></script>
    <script type="text/javascript" src="scripts/core.js?v=1"></script>
    <script type="text/javascript" src="scripts/events.js?v=1"></script>
    <script type="text/javascript" src="scripts/log.js?v=1"></script>
    <script type="text/javascript" src="scripts/bootloader.js?v=1"></script>
    <script type="text/javascript" src="scripts/domdata.js?v=1"></script>
    <script type="text/javascript" src="scripts/behaviors.js?v=1"></script>
    <script type="text/javascript" src="scripts/dependencies.js?v=12345"></script>
    <link rel="stylesheet" href="styles/jqueryUI.css" type="text/css" media="all" />
    <link rel="stylesheet" href="styles/shared.css" type="text/css" media="all" />
    <!-- PONG2 CASE STUDY OBJECTS -->
    <script type="text/javascript" src="scripts/pong2/lib/util/Position.js?v=12"></script>
    <script type="text/javascript" src="scripts/pong2/lib/util/Move.js?v=1234"></script>
    <script type="text/javascript" src="scripts/pong2/lib/game/Entity.js?v=12"></script>
    <script type="text/javascript" src="scripts/pong2/lib/game/Ball.js?v=123"></script>
    <script type="text/javascript" src="scripts/pong2/lib/game/Paddle.js?v=1234"></script>
    <script type="text/javascript" src="scripts/pong2/lib/game/Field.js?v=12"></script>
    <script type="text/javascript">
        var _gaq = _gaq || [];
        _gaq.push(['_setAccount', 'UA-28818516-1']);
        _gaq.push(['_trackPageview']);
        (function () {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
    </script>
</head>
<body>
    <div class="span0 center pal txt-white">
        <div data-behaviors-eager="Docs.ContentLoader" data-load="true" data-content="docs/content/header.htm">
        </div>
        <div class="clear pal mas span0">
            <!-- spacer -->
        </div>
        <div class="pal left span2">
            <div class="accordion" data-behaviors-eager="Docs.Accordion" data-auto-height="false"
                data-navigation="true" data-collapsible="false">
                <h3>
                    <a href="#">Objects & Inheritence</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-classes-namespace"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Namespacing</span></li>
                        <li class="pas" data-section="demos-classes-breakdown"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Object Breakdown</span></li>
                        <li class="pas" data-section="demos-classes-extend"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Extending an Object</span></li>
                        <li class="pas" data-section="demos-classes-override"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Overriding Members</span></li>
                    </ul>
                </div>
                <h3>
                    <a href="#">Dependency Injection</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-di-basics"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">DI Basics</span></li>
                        <li class="pas" data-section="demos-di-circular"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Circular Dependencies</span></li>
                    </ul>
                </div>
                <h3>
                    <a href="#">Behaviors</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-behaviors-basics"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Behavior Basics</span></li>
                        <li class="pas" data-section="demos-behaviors-messaging"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Message and Broadcast</span></li>
                        <li class="pas" data-section="demos-behaviors-data"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Using DOM Data</span></li>
                        <li class="pas" data-section="demos-behaviors-combine"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Combining Behaviors</span></li>
                        <li class="pas" data-section="demos-behaviors-events"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Using Events</span></li>
                        <li class="pas" data-section="demos-behaviors-queues"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Using the Message Queue</span></li>
                        <li class="pas" data-section="demos-behaviors-together"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Putting it all Together</span></li>
                        <li class="pas" data-section="demos-behaviors-advanced"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Advanced Behaviors</span></li>
                    </ul>
                </div>
                <h3>
                    <a href="#">Client Side Storage</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-storage-using"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Using Client Storage</span></li>
                    </ul>
                </div>
                <h3>
                    <a href="#">Unit Testing</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-testing-basics"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Basics</span></li>
                    </ul>
                </div>
                <h3>
                    <a href="#">Case Study :: Pong</a></h3>
                <div>
                    <ul class="none txt12" data-behaviors-eager="Docs.SectionSelector" data-load-content="true">
                        <li class="pas" data-section="demos-case-pong-intro"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Intro</span></li>
                        <li class="pas" data-section="demos-case-pong-pong1"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">First Iteration :: Behaviors</span></li>
                        <li class="pas" data-section="demos-case-pong-pong2"><span class="txt-red"><b>&raquo;</b>&nbsp;</span><span
                            class="link txt-white">Second Iteration :: Class Library</span></li>
                    </ul>
                </div>
            </div>
            <br />
            <br />
            <span class="txt-white txt10">Google Ads</span>
            <div class="bdr-white bol bg-black pal left span15">
                <div class="center">
                    <script type="text/javascript"><!--
                        google_ad_client = "ca-pub-7625754809889439";
                        /* Left Column Ad */
                        google_ad_slot = "9980631033";
                        google_ad_width = 125;
                        google_ad_height = 125;
                        //-->
                    </script>
                    <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
                    </script>
                </div>
            </div>
        </div>
        <div class="bdr-white bol bg-black pal right span7">
            <div class="section" id="demos-classes-namespace" style="display: block;" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/classes/namespace.htm" data-load="true">
            </div>
            <div class="section" id="demos-classes-breakdown" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/classes/breakdown.htm">
            </div>
            <div class="section" id="demos-classes-extend" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/classes/extending.htm">
            </div>
            <div class="section" id="demos-classes-override" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/classes/overriding.htm">
            </div>
            <div class="section" id="demos-di-basics" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/di/basics.htm">
            </div>
            <div class="section" id="demos-di-circular" data-behaviors-eager="Docs.ContentLoader"
                data-content="docs/demos/di/circular.htm">
            </div>
            <div class="section" id="demos-behaviors-basics" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/basics.htm">
            </div>
            <div class="section" id="demos-behaviors-messaging" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/messaging.htm">
            </div>
            <div class="section" id="demos-behaviors-data" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/data.htm">
            </div>
            <div class="section" id="demos-behaviors-combine" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/combine.htm">
            </div>
            <div class="section" id="demos-behaviors-events" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/events.htm">
            </div>
            <div class="section" id="demos-behaviors-queues" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/queues.htm">
            </div>
            <div class="section" id="demos-behaviors-together" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/together.htm">
            </div>
            <div class="section" id="demos-behaviors-advanced" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/behaviors/advanced.htm">
            </div>
            <div class="section" id="demos-storage-using" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/storage/using.htm">
            </div>
            <div class="section" id="demos-testing-basics" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/testing/basics.htm">
            </div>
            <div class="section" id="demos-case-pong-intro" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/casestudies/pong/intro.htm">
            </div>
            <div class="section" id="demos-case-pong-pong1" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/casestudies/pong/pong1.htm">
            </div>
            <div class="section" id="demos-case-pong-pong2" data-behaviors-lazy="Docs.ContentLoader"
                data-content="docs/demos/casestudies/pong/pong2.htm">
            </div>
            <div class="clear">
            </div>
        </div>
        <div class="clear pal mas span0">
            <!-- spacer -->
        </div>
        <div data-behaviors-eager="Docs.ContentLoader" data-load="true" data-content="docs/content/footer.htm">
        </div>
    </div>
</body>
</html>
